<template>
  <el-dialog :visible.sync="dialogVisible" title="新增员工" width="1200px">
    <el-form :model="formData" label-width="90px" :rules="rules" ref="formData">
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="姓名:" prop="name">
            <el-input v-model="formData.name" placeholder="姓名"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="性别:" prop="sex">
            <el-select v-model="formData.sex" style="width: 80px;">
              <el-option label="男" value="1"></el-option>
              <el-option label="女" value="2"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="出生日期:" prop="birth">
            <el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="formData.birth" placeholder="出生日期" style="width: 100%;">
            </el-date-picker>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="身份证号:" prop="idcardcode">
            <el-input v-model="formData.idcardcode" placeholder="身份证号"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="联系电话" prop="mobile">
            <el-input v-model="formData.mobile" placeholder="联系电话" style="width: 100%;"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="文化水平:" style="width: 100%;" prop="wenhua">
            <el-select v-model="formData.wenhua">
              <el-option label="小学" value="小学"></el-option>
              <el-option label="初中" value="初中"></el-option>
              <el-option label="高中" value="高中"></el-option>
              <el-option label="大学专科" value="大学专科"></el-option>
              <el-option label="大学本科" value="大学本科"></el-option>
              <el-option label="研究生及以上" value="研究生及以上"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="联系地址:" prop="address">
            <el-input v-model="formData.address" placeholder="联系地址"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="入职时间" prop="joindate">
            <el-date-picker type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="formData.joindate" placeholder="入职时间" style="width: 100%;">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="离职时间">
            <el-date-picker type="date"  format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="formData.overdate" placeholder="离职时间" style="width: 100%;">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">

        </el-col>
      </el-row>
      <el-row>
        <el-form-item label="备注信息" prop="memo">
          <el-input type="textarea" :rows="5" placeholder="备注信息" v-model="formData.memo"></el-input>
        </el-form-item>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false" size="medium">取 消</el-button>
      <el-button type="primary" size="medium" @click="handleSave">保 存</el-button>
    </div>
  </el-dialog>
</template>

<script>
  export default {
    data() {
      return {
        formData: {
          name: '',
          sex: "1",
          birth: '',
          idcardcode: '',
          address: '',
          mobile: '',
          wenhua: '初中',
          joindate: '',
          overdate: '',
          salery: 2000,
          memo: ''
        },
        dialogVisible: false,
        rules: {
          name: [{
            required: true,
            message: '姓名不能为空',
            trigger: 'blur'
          }],
          idcardcode: [{
            required: true,
            message: '身份证号码不能为空',
            trigger: 'blur'
          }],
          address: [{
            required: true,
            message: '联系地址不能为空',
            trigger: 'blur'
          }],
          mobile: [{
            required: true,
            message: '联系电话不能空',
            trigger: 'blur'
          }],
          salery: [{
            required: true,
            message: '工资不能空',
            trigger: 'blur'
          }]
        }
      }
    },
    methods: {
      handleSave() {
        const params = {
          name: this.formData.name,
          sex: this.formData.sex,
          birth: this.formData.birth,
          idcardcode: this.formData.idcardcode,
          mobile: this.formData.mobile,
          wenhua: this.formData.wenhua,
          address: this.formData.address,
          joindate: this.formData.joindate,
          overdate: this.formData.overdate,
          salery: this.formData.salery,
          memo: this.formData.memo
        }

       this.$refs.formData.validate((ok)=>{
          if(ok){

            this.axios.post("api/admin/mate/create",params).then((res)=>{
                if(res.status==200 && res.data.code==0){
                    this.$message.success({message:res.data.msg,duration:1500,showClose:true});
                    this.$emit("closeHandler");
                    this.dialogVisible=false;
                }
            })
             return true;
          }
          return false;
       })

      }
    }
  }
</script>

<style>
</style>
